@import '~@/styles/mixin.scss';

.head {
	&-box {
		width: 100%;
	}
	&-image {
		width: 100%;
		height: 320rpx;
		position: relative;
		top: -40rpx;
	}
}

.block {
	&-box {
		position: absolute;
		top: 40rpx;
		margin: 0 5%;
		width: 90%;
		padding-bottom: 120rpx;
			.content-page {
				margin-top: 40rpx;
			}
			.content-label {
				width: 310rpx !important;
			}
			.picker-suf-icon {
				width: 24rpx;
				height: 12rpx;
				margin-left: 16rpx;
				position: relative;
				top: -2rpx;
			}
			.placeholder-text {
				color: #606266;
				font-size: 28rpx;
			}
			.type-selector-input {
				height: 100rpx;
			}
	}
}

.mount-button {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9;
}
.upper-button {
  text-align: center;
  width: 120rpx;
  border-radius: 10rpx;
  padding: 20rpx 100rpx;
  border: 1rpx solid #2163e0;
  color: #2163e0;
}

.lower-button {
  text-align: center;
  width: 120rpx;
  border-radius: 10rpx;
  padding: 20rpx 100rpx;
  background-color: #2163e0;
  color: #fff;
}

.head-img {
  height: 366rpx;
  background: linear-gradient(180deg, #d3eaff 30%, rgba(211, 234, 255, 0) 100%);
  border-radius: 0rpx;
}

.view-page {
  position: absolute;
  width: 94%;
  top: 36rpx;
  left: 0;
  right: 0;
  margin: auto;
  padding-bottom: 120rpx;
}

.card-box {
  background-color: #fff;
  border-radius: 8rpx;
  padding: 0 32rpx;
  padding-bottom: 10rpx;
}

.card-box+.card-box {
  margin: 20rpx 0;
}

.card-head {
  display: flex;
  padding-top: 30rpx;
}

.card-title-before {
  background-color: $main-color;
  border-radius: 20%;
  width: 8rpx;
  height: 22rpx;
  margin: auto 0;
  margin-right: 10rpx;
}

.card-title {
  color: #000000;
  font-size: 32rpx;
  font-weight: bold;
  margin: auto 0;
}

.content-item {
  /* margin: 5rpx 0; */
  padding: 20rpx 15rpx;
  line-height: 55rpx;
}

.visible {
  display: flex;
}

.content-item.mar + .content-item.mar {
  border: none;
}

// .content-item {
//   margin-left: 10rpx;
// }

.content-label {
  color: #909399;
  font-size: 30rpx;
  width: 300rpx;
}

.content-value {
  color: #303133;
  font-size: 30rpx;
}

.value-nav {
  font-size: 26rpx;
  color: $main-color;
  margin: auto 0;
}

.value-nav image {
  width: 32rpx;
  height: 32rpx;
  position: relative;
  top: 8rpx;
}

.content-inform {
  font-size: 26rpx;
  line-height: 38rpx;
  padding: 20rpx 0;
  border-bottom: 1rpx dashed #cdd0d8;
}

.inform-title {
  margin-bottom: 20rpx;
}

.inform-box {
  background-color: #f6f6f6;
  padding: 20rpx 0;
  font-size: 26rpx;
  color: #606266;
}

.content-form-item {
  position: relative;
  background-color: #f6f6f6;
  padding: 10rpx 0;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  width: 100%;
}

.content-form-left {
  display: flex;
}

.content-form-right {
  margin: auto 10rpx;
  height: 100%;
}

.content-form-right image {
  min-width: 32rpx !important;
  max-width: 32rpx !important;
  height: 32rpx !important;
  position: relative;
  top: 20rpx;
}

.form-icon {
  width: 64rpx;
  height: 64rpx;
}

.form-title {
  color: #297efd;
  /* color: $main-color; */
  font-size: 30rpx;
  margin: auto 0;
  /* margin-left: 20rpx; */
  word-wrap: break-word;
  word-break: break-all;
}

.red-tips {
  color: #d81001;
}

.bold {
  font-weight: bold;
}

.space-between {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.pic-box {
  margin: 20rpx 0 20rpx 0;
  display: grid;
  grid-template-columns: repeat(5, auto);
  row-gap: 20rpx;
  column-gap: 20rpx;
}

.pic-box image {
  width: 112rpx;
  height: 112rpx;
  border: 1rpx solid skyblue;
}

.button {
  color: white;
  background-color: $main-color;
  /* box-shadow: 0 8rpx 16rpx 0 #b8dafa; */
  box-shadow: 0rpx 1rpx 8rpx 1rpx #ffffff, 0px 4px 12px 1px rgba(33, 99, 224, 0.5);
  width: 76%;
  margin: 30rpx auto;
  padding: 20rpx;
  text-align: center;
  font-size: 30rpx;
  border-radius: 10rpx;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9;
}

.content-ipt-mark {
  position: absolute;
  left: 30rpx;
  color: #d81001;
}

.content-form {
  font-size: 30rpx;
  display: flex;
}

.content-form image {
  min-width: 64rpx;
  max-height: 64rpx;
  margin: 0 10rpx 0 0;
  /* background-color: #EFF5FF; */
  padding: 10rpx;
  border-radius: 50%;
}

.content-operation {
  display: grid;
  grid-template-columns: repeat(2, auto);
  row-gap: 5rpx;
  column-gap: 10rpx;
  font-size: 28rpx;
}

.radio-item {}

.radio-data {
  display: inline;
  display: inline-block;
  font-size: 30rpx;
}

.radio-item image {
  width: 40rpx;
  height: 40rpx;
  margin: auto 10rpx auto 0;
  position: relative;
  top: 10rpx;
}

.content-long-input {
  color: #606266;
  font-size: 28rpx;
}

.roll-button {
  color: white;
  background-color: $main-color;
  box-shadow: 0px 1rpx 8rpx 1rpx #ffffff, 0px 8rpx 24rpx 1rpx rgba(33, 99, 224, 0.5);
  width: 76%;
  margin: 30rpx auto 0 auto;
  padding: 20rpx;
  text-align: center;
  font-size: 30rpx;
  border-radius: 10rpx;
}

.pic {
  /* background-color: #F6F6F6; */
  padding: 10rpx;
}

.content-autograph {
  height: 96rpx;
  max-width: 200rpx;
}